import React, {
	Component
}
from 'react';

import {
	Icon
}
from 'antd';

import '../../../static/flipclock.min.js';


class Timer extends Component {
	constructor(props) {
		super(props);

		let stopSeconds = (18 * 60 + 59) * 60 + 59;
		let day = null;
		let overplus = 0;
		const _this = this;

		overplus = this.props.seconds;

		this.state = {
			stop: overplus <= 0 ? true : false,
			loading: true,
			seconds: overplus
		};
	}
	timer() {
		var clock = $(this.refs.timer2).FlipClock({
			countdown: true
		});
		clock.setTime(this.state.seconds);
		clock.start();

		this.state.clock = clock;
	}
	componentDidMount() {
		if (this.state.stop) return;

		this.timer();
	}
	render() {
		if (this.state.stop) {
			return (
				<div className="timer-end" style={{padding: '20px 0', textAlign: 'center'}}>
					<Icon type="frown-circle" style={{fontSize: '40px', verticalAlign: 'middle', marginRight: '8px'}}/>
					<span>订餐截止啦</span>
				</div>
			)
		} else {
			return (
				<div>
					<div ref="timer2"></div>
				</div>
			)
		}
	}
}

export {
	Timer
}